<div style="float: left;">
    <img src="assets/images/wechat/phone.png">

    <div style="width: 289px;height:50px;border: 1px solid #FFFFFF;border-top: 0px;background-color: #EFEFEF">
        <div style="float: left;width: 50px;height:100%;text-align: center;border-right: 1px solid #FFFFFF;">
            <i class="fa fa-caret-up" aria-hidden="true" style="display: block;position: relative;top: 5px"></i>
            <i class="fa fa-keyboard-o" aria-hidden="true" style="font-size: 21px;display: block"></i>
        </div>
        <div style="float: left;width: 237px;height:100%;">
            <div class="levelOneMenu" ng-repeat="menu in menus" ng-style="levelOneMenuCssStyle"
                 ng-click="selectLevelOneMenu($event,menu)" after-repeat-dom-create="afterLevelOneMenuCreate()">
                <span ng-if="menu.name!=''">{{menu.name}}</span>
                <span ng-if="menu.name==''">菜单名称</span>

                <div ng-if="currMenu==menu||menu.subMenus.indexOf(currMenu)>=0" ng-style="menu.subMenuCssStyle"
                     style="position: absolute;border: 1px solid #CECECE;background-color: #EFEFEF;">
                    <div class="levelTwoMenu" style="height: 43px;line-height: 43px;border-bottom: 1px solid #CECECE;overflow: hidden;text-overflow: ellipsis"
                         ng-repeat="subMenu in menu.subMenus" ng-click="selectLevelTwoMenu($event,subMenu)">
                        <span ng-if="subMenu.name!=''">{{subMenu.name}}</span>
                        <span ng-if="subMenu.name==''">菜单名称</span>
                    </div>
                    <div style="height: 43px;line-height: 43px" ng-click="addLevelTwoMenu()"
                         ng-if="menu.subMenus.length<=4">
                        <i class="fa fa-plus" aria-hidden="true"></i>
                    </div>
                </div>
                <div ng-if="currMenu==menu||menu.subMenus.indexOf(currMenu)>=0">
                    <span class="caret" style="position: absolute;top:-15px;margin-left:-4px;color: #CECECE"></span>
                </div>
            </div>
            <div class="addLevelOneMenuDiv" ng-style="levelOneMenuCssStyle" ng-click="addLevelOneMenu()"
                 after-dom-create="setAddLevelOneMenuBtnCssStyle()">
                <i class="fa fa-plus" aria-hidden="true"></i>
                <span ng-if="menus.length==0">添加菜单</span>
            </div>
        </div>
    </div>
</div>


<div style="height: 530px;width: auto;background-color: white;margin-left: 289px;padding: 20px">
    <div ng-if="!currMenu" style="height: 100%;width: 100%;line-height: 530px;text-align: center">
        点击左侧菜单进行编辑操作
    </div>
    <div ng-if="currMenu">
        <div style="border-bottom: 1px solid #E2E2E2;padding-bottom: 10px">
            <span ng-if="currMenu.name==''">菜单名称</span>
            <span ng-if="currMenu.name!=''">{{currMenu.name}}</span>
            <span ng-click="deleteMenu()" style="float: right;color: #459ae9;cursor: pointer">删除菜单</span>
        </div>

        <div class="form-group form-inline" style="margin-top: 20px">
            <label style="margin-right: 20px"><b>菜单名称</b></label>
            <input id="name" type="name" name="title" class="form-control" name="name" placeholder="" maxlength="16"
                   ng-model="currMenu.name">
            <span style="display: inline-block;margin-left: 20px;color: #8d8d8d;" ng-show="currMenu.level=='1'">*字数不超过4个汉字或8个字母</span>
            <span style="display: inline-block;margin-left: 20px;color: #8d8d8d;" ng-show="currMenu.level=='2'">*字数不超过8个汉字或16个字母</span>
        </div>

        <div ng-if="(currMenu.level==1&&currMenu.subMenus.length==0)||currMenu.level==2">
            <div class="form-group form-inline" style="margin-top: 20px">
                <label style="margin-right: 20px"><b>菜单内容</b></label>
                <label class="radio-inline">
                    <input type="radio" name="kind" id="inlineRadio1" value="message" ng-model="currMenu.kind">发送消息
                </label>
                <label class="radio-inline">
                    <input type="radio" name="kind" id="inlineRadio2" value="url" ng-model="currMenu.kind">转跳网页
                </label>
            </div>

            <div style="height: 300px;width: 600px;border: 1px solid #E2E2E2 ">
                <div ng-show="currMenu.kind=='message'">
                    <div style="border-bottom: 1px solid #E2E2E2;padding-bottom: 10px;height: 40px;line-height: 40px">
                <span ng-click="selectMessageType('view_limited',$event)" class="messageType"
                      style="display: inline-block;margin-left: 20px;cursor: pointer;color: #2196F3"><i
                        class=" fa fa-newspaper-o"></i><span
                        style="display: inline-block;margin-left: 5px">图文消息</span></span>
                <span ng-click="selectMessageType('click',$event)" class="messageType"
                      style="display: inline-block;margin-left: 20px;cursor: pointer"><i class="fa fa-pencil"></i><span
                        style="display: inline-block;margin-left: 5px">文字</span></span>
                <span ng-click="selectMessageType('media_id',$event)" class="messageType"
                      style="display: inline-block;margin-left: 20px;cursor: pointer"><i class="fa fa-image"></i><span
                        style="display: inline-block;margin-left: 5px">图片</span></span>
                    </div>

                    <div style="height: 259px;width: 100%;">
                        <div ng-if="currMenu.type=='view_limited'">
                            <div ng-if="!data_view_limited"
                                 style="padding: 30px 70px;text-align: center;color: #8d8d8d">
                                <div style="height: 200px;width: 200px;border: 1px solid black;float: left;border: 1px dashed #D4D4D4;padding-top: 55px">
                                    <i class="fa fa-plus" aria-hidden="true" style="font-size: 40px"></i>
                                    <span style="display: block">从素材库中选择</span>
                                </div>
                                <div style="height: 200px;width: 200px;border: 1px solid black;float: left;border: 1px dashed #D4D4D4;padding-top: 55px;margin-left: 50px;">
                                    <i class="fa fa-plus" aria-hidden="true" style="font-size: 40px"></i>
                                    <span style="display: block">新建图文消息</span>
                                </div>
                            </div>
                            <div ng-if="data_view_limited"></div>
                        </div>

                        <div ng-if="currMenu.type=='click'" style="height: 100%">
                            <textarea
                                    style="width: 90%;height: 90%;margin-left: 5%;margin-top: 2%;resize: none" ng-model="currMenu.key"></textarea>
                        </div>


                        <div ng-if="currMenu.type=='media_id'">
                            <div ng-if="!data_media_id" style="padding: 30px 70px;text-align: center;color: #8d8d8d">
                                <div style="height: 200px;width: 200px;border: 1px solid black;float: left;border: 1px dashed #D4D4D4;padding-top: 55px">
                                    <i class="fa fa-plus" aria-hidden="true" style="font-size: 40px"></i>
                                    <span style="display: block">从素材库中选择</span>
                                </div>
                                <div style="height: 200px;width: 200px;border: 1px solid black;float: left;border: 1px dashed #D4D4D4;padding-top: 55px;margin-left: 50px;">
                                    <i class="fa fa-plus" aria-hidden="true" style="font-size: 40px"></i>
                                    <span style="display: block">上传图片</span>
                                </div>
                            </div>
                            <div ng-if="data_media_id"></div>
                        </div>
                    </div>
                </div>
                <div ng-if="currMenu.kind=='url'" style="padding: 20px">
                    <div style="color: #8d8d8d;">订阅者点击该子菜单会跳到以下链接</div>
                    <div class="form-group form-inline" style="margin-top: 20px">
                        <label style="margin-right: 20px"><b>页面地址</b></label>
                        <input type="text" name="title" class="form-control" name="title" placeholder="" maxlength="200"
                               style="width: 400px"
                               ng-model="currMenu.url">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div style="width:100%;height: 45px;line-height: 45px;background-color: rgba(158, 158, 158, 0.3);text-align: right;padding-right: 5px">
    <input type="button" class="btn btn-primary" value="保存" style="min-width: 100px" ng-click="save()">
</div>
